import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

import '../../../../resource/language/generated/l10n.dart';

class RoomListItemWidget extends StatefulWidget {
  // final Channel channel;
  late String btnStr;

  /// 点击按钮回调
  final VoidCallback? btnOnPressed;

  /// 点击背景回调
  final VoidCallback? bgOnPressed;

  RoomListItemWidget({
    Key? key,
    // required this.channel,
    String? btnStr,
    this.btnOnPressed,
    this.bgOnPressed,
  }) : super(key: key) {
    this.btnStr = btnStr ?? T.current!.join;
  }

  @override
  State<RoomListItemWidget> createState() => _RoomListItemWidgetState();
}

class _RoomListItemWidgetState extends State<RoomListItemWidget> {
  bool isTapping = false;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        widget.bgOnPressed?.call();
      },
      child: Container(
        decoration: isTapping
            ? BoxDecoration(
                gradient: const LinearGradient(
                    colors: [Color(0xFFD5A9FF), Color(0xFF92ACFF)]),
                borderRadius: BorderRadius.circular(12),
              )
            : BoxDecoration(
                color: const Color(0xFFF6F7F9),
                borderRadius: BorderRadius.circular(12),
              ),
        padding: const EdgeInsets.only(left: 6, right: 20, top: 6, bottom: 6),
        margin: const EdgeInsets.only(bottom: 16, left: 23, right: 25),
        child: Row(
          children: [
            Text('AvatarImage'),
            // AvatarImage(
            //   url: widget.channel.icon,
            //   width: 58,
            //   height: 58,
            //   borderRadius: 6.65,
            // ),
            const SizedBox(
              width: 10,
            ),
            Expanded(
                child: Column(
              mainAxisSize: MainAxisSize.min,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  'widget.channel.title',
                  softWrap: false,
                  overflow: TextOverflow.ellipsis,
                  maxLines: 1,
                  style: TextStyle(
                    fontSize: 12,
                    color: isTapping ? Colors.white : const Color(0xff333333),
                    fontWeight: FontWeight.w600,
                    height: 1,
                  ),
                ),
                const SizedBox(
                  height: 7,
                ),
                Text(
                  'widget.channel.title',
                  style: TextStyle(
                    fontSize: 10,
                    color: isTapping ? Colors.white : const Color(0xff333333),
                    fontWeight: FontWeight.w400,
                    height: 1,
                  ),
                ),
                const SizedBox(
                  height: 8,
                ),
                Row(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    GestureDetector(
                      onTap: () {
                        print("11");
                      },
                      child: Container(
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(2),
                          border: Border.all(
                            color: isTapping
                                ? Colors.white
                                : const Color(0xFF333333),
                            width: 0.67,
                          ),
                        ),
                        padding: const EdgeInsets.symmetric(
                          horizontal: 6,
                          vertical: 0,
                        ),
                        height: 12,
                        alignment: Alignment.center,
                        child: Text(
                          'widget.channel.roomLabelDesc',
                          style: TextStyle(
                            fontSize: 8,
                            color: isTapping
                                ? Colors.white
                                : const Color(0xff333333),
                            fontWeight: FontWeight.w500,
                          ),
                          // strutStyle: StrutStyle(
                          //     height: 1,
                          //     forceStrutHeight: true
                          // ),
                        ),
                      ),
                    ),
                    const SizedBox(
                      width: 10,
                    ),
                    Image.asset(
                      "assets/images/ic_people.png",
                      width: 10,
                      height: 10,
                      fit: BoxFit.fill,
                      color: isTapping ? Colors.white : const Color(0xff333333),
                    ),
                    const SizedBox(
                      width: 3,
                    ),
                    Text(
                      T.current!.some_people('widget.channel.currentUserCount'),
                      style: TextStyle(
                        fontSize: 8,
                        color:
                            isTapping ? Colors.white : const Color(0xff333333),
                        fontWeight: FontWeight.w500,
                      ),
                      strutStyle:
                          const StrutStyle(height: 1, forceStrutHeight: true),
                    ),
                  ],
                )
              ],
            )),
            const SizedBox(
              width: 20,
            ),
            GestureDetector(
              onTapDown: (TapDownDetails details) {
                setState(() {
                  isTapping = true;
                });
              },
              onTapUp: (TapUpDetails details) {
                setState(() {
                  isTapping = false;
                });
                widget.btnOnPressed?.call();
              },
              onTapCancel: () {
                setState(() {
                  isTapping = false;
                });
              },
              child: Container(
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(14),
                ),
                width: 60,
                height: 27,
                alignment: Alignment.center,
                child: Text(
                  widget.btnStr,
                  style: const TextStyle(
                    fontSize: 13,
                    color: Color(0xff333333),
                    fontWeight: FontWeight.w500,
                  ),
                  strutStyle: const StrutStyle(
                    height: 1,
                    forceStrutHeight: true,
                  ),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}
